<template>
  <div class="treatmentOuter">
    <div class="nav-search">
      <el-input v-model="query.key" placeholder="患者姓名/医生姓名/诊所名称/订单编号/病例编号"></el-input>
      <el-date-picker
        v-model="query.dateTime"
        :clearable="false"
        type="date"
        value-format="yyyy-MM-dd"
        format="yyyy-MM-dd"
        placeholder="创建日期"
      >
      </el-date-picker>
      <span>
        <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
        <el-button class="filter-item" size="mini" type="warning" icon="el-icon-download" @click="exportList">导出</el-button>
      </span>
    </div>
    <div class="tableList">
      <el-table
        ref="table"
        v-loading="crud.loading"
        stripe
        :data="crud.data"
        size="small"
        style="width: 100%;"
        @selection-change="crud.selectionChangeHandler"
      >
        <el-table-column prop="order" label="订单编号"></el-table-column>
        <el-table-column prop="" label="订单状态"></el-table-column>
        <el-table-column prop="" label="创建时间"></el-table-column>
        <el-table-column prop="" label="订单类型"></el-table-column>
        <el-table-column prop="" label="费用类型"></el-table-column>
        <el-table-column prop="" label="患者姓名"></el-table-column>
        <el-table-column prop="" label="诊疗阶段"></el-table-column>
        <el-table-column prop="" label="主治医生"></el-table-column>
        <el-table-column prop="" label="套餐名称"></el-table-column>
        <el-table-column prop="" label="产品名称"></el-table-column>
        <el-table-column prop="" label="诊所名称"></el-table-column>
      </el-table>
      <!--分页组件-->
      <pagination></pagination>
    </div>
  </div>
</template>
<script>
// import crudPatient from '@/api/patient';
import crudTOrder from '@/api/order';
import CRUD, { presenter, header, form, crud } from '@crud/crud';
import pagination from '@crud/Pagination';

const defaultForm = { key: null, dateTime: null };
export default {
  name: 'TreatmentOuter',
  components: { pagination },
  mixins: [presenter(), header(), form(defaultForm), crud()],
  cruds() {
    return CRUD({ title: 'PatientService', url: '', sort: 'id,desc', crudMethod: { ...crudTOrder } });
    // return CRUD({ title: 'PatientService', url: '/his-order/tOrder/queryPage', sort: 'id,desc', crudMethod: { ...crudTOrder } });
  },
  data() {
    return {
      data: [
        { order: 1 },
        { order: 1 },
        { order: 1 }
      ],
      // loading: false,
      // searchParams: {
      //   key: '',
      //   dateTime: ''
      // },
      optShow: {
        reset: true
      }
    };
  },
  mounted() {
    console.log(this.$store.state.user.autoPath);
  },
  methods: {
    selectionChangeHandler() {},
    toQuery() {},
    exportList() {}
  }
};
</script>
<style scoped lang='scss'>
.nav-search{
  padding: 10px 0;
  .el-input{
    width: 320px;
    margin-right: 10px;
  }
  .el-date-editor--date{
    width: 150px;
  }
}
</style>
